<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../lib/swiper-bundle.min.css">
    <link rel="stylesheet" href="../lib/iconfont-index/iconfont.css">
    <link rel="stylesheet" href="../css/index.css">
</head>

<body>
    <!-- 页头 -->
    <div id="header">
        <!-- 左logo -->
        <div class="container clearfix">
            <div class="logoBox fl">
                <a href="#" class="clearfix">
                    <img src=""
                        alt="" class="logo fl">
                    <div class="logoText fl">
                        <h3 class="trademark">熊猫优选</h3>
                        <span>XIONG MAO YOU XUAN</span>
                    </div>
                </a>
            </div>
            <!-- 中输入框 -->
            <div class="SearchBox fl">
                <span class="iconfont icon-sousuo"></span>
                <input type="" placeholder="搜索商品，发现更多优惠">
                <div class="search">搜索</div>
            </div>
            <!-- 右图标 -->
            <div class="guarantee fl">
                <ul class="clearfix">
                    <li>
                        <img src=""
                            alt="全程包邮">
                        <p>全程包邮</p>
                    </li>
                    <li>
                        <img src=""
                            alt="7天退换">
                        <p>7天退换</p>
                    </li>
                    <li>
                        <img src=""
                            alt="品质保证">
                        <p>品质保证</p>
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <!-- 导航 -->
    <div class="nav">
        <ul class="container clearfix">
            <a href="">
                <li class="nav-index" data="open">首页</li>
            </a>
            <a href="./freeShipping.html">
                <li class="nav-other">9块9包邮</li>
            </a>
            <a href="./ticket.html">
                <li class="nav-other">超值大额券</li>
            </a>
            <a href="./cooling.html">
                <li class="nav-other">降温急救穿搭</li>
            </a>
        </ul>
    </div>
    <!-- 导航后的内容 -->
    <div id="navCarousel">
        <!-- 列表与广告 -->
        <div class="listAds container clearfix">
            <!-- 列表 -->
            <div class="list fl">
                <ul>
                    <li class="clearfix" data-index="2-13">
                        <span class="text iconfont icon-nvzhuangneiyi"></span>
                        <p class="text" data-index="2">女装/</p>
                        <p class="text" data-index="13">女鞋</p>
                    </li>
                    <li class="clearfix" data-index="5-19">
                        <span class="text iconfont icon-gaogenxie"></span>
                        <p class="text" data-index="5">男装/</p>
                        <p class="text" data-index="19">男鞋</p>
                    </li>
                    <li class="clearfix" data-index="3">
                        <span class="text iconfont icon-meizhuang"></span>
                        <p class="text" data-index="3">美妆/</p>
                        <p class="text">个护</p>
                    </li>
                    <li class="clearfix" data-index="4-14">
                        <span class="text iconfont icon-V"></span>
                        <p class="text" data-index="4">配饰/</p>
                        <p class="text" data-index="14">箱包</p>
                    </li>
                    <li class="clearfix" data-index="10">
                        <span class="text iconfont icon-lingshi"></span>
                        <p class="text" data-index="10">&ensp;零食王国</p>
                    </li>
                    <li class="clearfix" data-index="24">
                        <span class="text iconfont icon-lingshi"></span>
                        <p class="text" data-index="24">&ensp;母婴用品</p>
                    </li>
                    <li class="clearfix" data-index="6-12">
                        <span class="text iconfont icon-gaogenxie"></span>
                        <p class="text" data-index="6">手机/</p>
                        <p class="text" data-index="12">数码</p>
                    </li>
                    <li class="clearfix" data-index="11">
                        <span class="text iconfont icon-neiyi"></span>
                        <p class="text" data-index="16">&ensp;内衣袜子</p>
                    </li>
                    <li class="clearfix" data-index="11-7">
                        <span class="text iconfont icon-jiaju-"></span>
                        <p class="text" data-index="7">文娱/</p>
                        <p class="text" data-index="16">家具</p>
                    </li>
                </ul>
                <div class="commodityBox">
                    <div class="commodityBoxIn"></div>
                </div>
            </div>
            <!-- 广告，轮播 -->
            <div class="ads fl">
                <div class="top clearfix">
                    <div class="banner fl">
                        <div class="swiper">
                            <div class="swiper-wrapper">
                                <div class="swiper-slide"><img
                                        src="//img1.lukou.com/static/coupon/p/image_link/fCIwSWAleJUCBePcmupGODXBWK3yo8bg.jpeg"
                                        alt="">
                                </div>
                                <div class="swiper-slide"><img
                                        src="http://img1.lukou.com/static/coupon/p/image_link/v0I932wGsDoUK4eG4P6PIbNkSdPokflI.jpeg"
                                        alt="">
                                </div>
                                <div class="swiper-slide"><img
                                        src="http://img1.lukou.com/static/coupon/p/image_link/hysAxvvgCTiczcuVbbYq99Zlz7q0RQzY.png"
                                        alt="">
                                </div>
                            </div>
                            <!-- 如果需要分页器 -->
                            <div class="swiper-pagination"></div>

                            <!-- 如果需要导航按钮 -->
                            <div class="swiper-button-prev"></div>
                            <div class="swiper-button-next"></div>

                        </div>
                    </div>
                    <a href="./freeShipping.html">
                        <div class="banner-left fl">
                            <h3>9块9包邮</h3>
                            <div>保你不吃亏</div>
                            <img src="http://img1.lukou.com/static/coupon/p/image_link/Q34r2F1uSePMh64rnVsuidyw1Q7gWi0W.gif"
                                alt="">
                        </div>
                    </a>
                </div>
                <div class="bottom clearfix">
                    <a href="./cooling.html">
                        <div class="left">
                            <h3>降温急救穿搭</h3>
                            <p>速来抢购~</p>
                            <span>Go</span>
                            <img src="http://img1.lukou.com/static/coupon/p/image_link/wpyCxJo1GSvfq8vvG1n6GtFRAo37zZ2j.png"
                                alt="">
                        </div>
                    </a>
                    <a href="./ticket.html">
                        <div class="mindle">
                            <h3>超值大额券</h3>
                            <p>优惠直击底价</p>
                            <span>Go</span>
                            <img src="http://img1.lukou.com/static/p/commodity/img/20181212-235507.png" alt="">
                        </div>
                    </a>
                    <a href="#">
                        <div class="right">
                            <p>扫码下载APP</p>
                            <p>发现更多惊喜</p>
                            <img src=""
                                alt="">
                        </div>
                    </a>
                </div>
            </div>
        </div>
        <!-- 小编精选 -->
        <div class="choose container">
            <h3>小编精选</h3>
            <p>每天更新</p>
        </div>
        <!-- 固定商品列表 -->
        <div id="fixedList" class="container">
            <ul class="clearfix"></ul>
        </div>

        <div class="SeeMore container">
            <div>查看更多</div>
        </div>

        <div id="RenderTheList" class="container"></div>
    </div>
    <!-- 页脚 -->
    <div id="footer">
        <div class="container">
            <div class="top clearfix">
                <div class="left fl clearfix">
                    <img src="http://img1.lukou.com/static/img/activity/icon.png" alt="" class="fl">
                    <div class="title fl">
                        <h1>熊猫优选</h1>
                        <p>年轻人网购首选<br>购物领券更省钱</p>
                    </div>
                </div>
                <div class="minddle fl">
                    <span>|</span><a>下载app</a>
                </div>
            </div>
            <div class="bottom">
                <img src="http://img1.lukou.com/static/img/activity/policeIcon.png" alt="">
                <p>浙公安网备案&emsp;33010602009949号&emsp;|&emsp;ICP备案号: 浙ICP备17012864号-1&emsp;|&emsp;</p>
                <img src="http://img1.lukou.com/static/img/activity/license.png" alt="">
                <p><a href="#">证照信息</a></p>
            </div>
        </div>
    </div>

    <!-- 回到顶部 -->
    <div id="return" onclick="outputTop()">回到<br>顶部</div>
    <script src="../js/ajaxUtil.js"></script>
    <script src="../js/jquery-3.6.0.js"></script>
    <script src="../lib/swiper-bundle.min.js"></script>
    <script src="../js/index.js"></script>

</body>

</html>